<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="relax.css">
    <title>RelaxCSS : install</title>
</head>
<style type="text/css">
		@font-face
	{
		font-family: "nuni";
		src:url('fonts/nuni.ttf');
	}
	body
	{
		 font-family: "nuni";
	}
	pre
	{ 
		font-family:"consolas" ,"menlo" ,"source code pro","ubuntu mono" ,"roboto mono","inconsolata",monospace;
	}
	aside
	{
		position: sticky; 
		top : 1px ;
		height: 90vh; 
		overflow: scroll ; 
		margin-right: 1em; 
	}
	ul
	{
		list-style-type: none; 
		padding: 0px; 

	}
	aside a
	{
		color:#777;
		text-decoration: none ;  
	}
	aside a:hover
	{
		color:#111;
		background-color: #eee; 
		padding: .5em ; 
		border-radius: 4px; 
	}
	aside li
	{
		padding: 0.8em;
		font-size: 0.9em; 
	}
	main
	{
		margin-left: 1em ; 
		display: grid ; 
		grid-template-columns: 1fr 3fr ; 
	}

</style>
<body>
    <nav class='nav sb'>
		<a class='nav-brand' href="index.html">RelaxCSS</a>
		<ul class='nav-sa'>
			<li><a href="index.html">Home</a></li>
			<li><a href="install.html">Get started</a></li>
			<li><a href="classes.html">Classes</a></li>
			<li><a href="https://github.com/Ziyadsk/relaxCSS">Github</a></li>
		</ul>
    </nav>
    <main class="w-2">
	<aside></aside>     
    <div class="container center w-4">

            <h1>Get Started</h1>
            <h2 id="Download">1.Download</h2>
            
            <div class="text-container dark">
                 <p>Download here <a href="https://github.com/Ziyadsk/relaxCSS/releases/download/1.0/relaxCSS.css.zip">relaxCSS</a>.</p>

            </div>

            <h2 id="Install">2.Installing</h2>
          <div class="text-container dark">
                    <p>Simply add a link tag to add the relaxCss file to your html .</p>
                    <span class="underlined">Example:</span>
                 <xmp><link rel="stylesheet" href="relaxCSS.css">
				</xmp>
                </div>
               
            <h2>3.Have fun</h2>
            <div class="text-container dark">
                    <p>Add classes to your HTML elements to see change, for reference see <a href="classes.html">All Classes</a> </p>
            </div>
          
    </div>
    
    </main>
</body>
</html>